<!-- Start Content-->
<div class="container-fluid admin-custom" id="welcome">

    <!-- start page title -->
    <div class="row">
        <div class="col-12">
            <div class="page-title-box">
                <div class="page-title-left mt-3">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="/workplace"><i class="feather icon-home"></i></a></li>
                        <li class="breadcrumb-item active">文章列表</li>
                    </ol>
                </div>
            </div>
        </div>

        <div class="col-xl-12 col-md-12">
            <div class="col-md">
                <div class="card mb-3">
                    <!-- Add `.with-elements` to the parent `.card-header` element -->
                    <div class="card-header with-elements">
                        <h5 class="card-header-title mr-2">
                            文章列表
                        </h5>
                        <div class="card-header-elements ml-md-auto">
                            <button type="button" class="btn btn-xs btn-outline-primary"><a
                                        href="/article/details"><span class="ion ion-md-add"></span> 新增</a></button>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="card-title">
                            <form method="get" action="/article/list" class="row">
                                <div class="col-md-5 col-sm-6 pr-0 mb-2">
                                    <input id="article-title" type="text" class="form-control" name="title"
                                           placeholder="请输入要搜索的文章标题">
                                </div>
                                <div class="col-md-3 col-sm-6 pr-0">
                                    <select class="select2 form-control" data-toggle="select2"
                                            id="article-type"
                                            name="tag"
                                            data-placeholder="Choose ...">
                                        <option selected="selected" disabled="disabled" style="display: none;"
                                                value=""></option>
                                        {{range $i, $v := .articleTypeList}}
                                            {{if $v.child}}
                                                <optgroup label="{{$v.name}}">
                                                    {{range $key, $item := $v.child}}
                                                        <option value="{{$v.id}},{{$item.id}}">{{$item.name}}</option>
                                                    {{end}}
                                                </optgroup>
                                            {{else if and (eq $v.child_status false) (ne $v.name "首页")}}
                                                <option value="{{$v.id}}">{{$v.name}}</option>
                                            {{end}}
                                        {{end}}
                                    </select>
                                </div>
                                <div class="col-md-2 col-sm-6 pr-0">
                                    <select class="select2 form-control" data-toggle="select2" autocomplete="off"
                                            name="visible" data-placeholder="Choose ...">
                                        {{if eq .visible_id "0"}}
                                            <option selected value="0">全部</option>
                                        {{else}}
                                            <option value="0">全部</option>
                                        {{end}}
                                        {{if eq .visible_id "1"}}
                                            <option selected value="2">已上架</option>
                                        {{else}}
                                            <option value="1">已上架</option>
                                        {{end}}
                                        {{if eq .visible_id "2"}}
                                            <option selected value="2">已下架</option>
                                        {{else}}
                                            <option value="2">已下架</option>
                                        {{end}}
                                    </select>
                                </div>
                                <div class="col-md-2 col-sm-6">
                                    <button class="btn  btn-primary" type="submit">查询</button>
                                    <a class="btn  btn-danger" href="/article/list?page=1">重置</a>
                                </div>
                            </form>
                        </div>
                        <div class="card">
                            <table id="datatable-buttons" class="table table-striped dt-responsive nowrap" width="100%">
                                <thead>
                                <tr>
                                    <th>标题</th>
                                    <th>分类</th>
                                    <th>编辑时间</th>
                                    <th>推荐位</th>
                                    <th>点击量</th>
                                    <th>移动</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                {{if eq .articleList.total 0}}
                                    <tbody>
                                    <tr>
                                        <td colspan="7">
                                            <div class="ant-empty ant-empty-normal">
                                                <div class="ant-empty-image">
                                                    <svg width="64" height="41" viewBox="0 0 64 41"
                                                         xmlns="http://www.w3.org/2000/svg">
                                                        <g transform="translate(0 1)" fill="none" fillRule="evenodd">
                                                            <ellipse fill="#F5F5F5" cx="32" cy="33" rx="32"
                                                                     ry="7"></ellipse>
                                                            <g fillRule="nonzero" stroke="#D9D9D9">
                                                                <path d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"></path>
                                                                <path d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z"
                                                                      fill="#FAFAFA"></path>
                                                            </g>
                                                        </g>
                                                    </svg>
                                                </div>
                                                <p class="ant-empty-description">暂无数据</p></div>
                                        </td>
                                    </tr>
                                    </tbody>
                                {{else}}
                                    <tbody>
                                    {{range $i, $v := .articleList.list}}
                                        <tr>
                                            <td>
                                                {{if $v.Markdown}}
                                                    <a href="/article/details/markdown?id={{$v.Id}}&title={{$v.Title}}"
                                                       class="text-c-blue">{{$v.Title}}</a>
                                                {{else}}
                                                    <a href="/article/details?id={{$v.Id}}&title={{$v.Title}}"
                                                       class="text-c-blue">{{$v.Title}}</a>
                                                {{end}}
                                            </td>
                                            {{if $v.CategoryId}}
                                                {{range $i, $type := $.articleTypeList}}
                                                    {{if and $type.child (eq $type.id $v.MenuId)}}
                                                        {{range $key, $item := $type.child}}
                                                            {{if IsArticleTypeName $v.CategoryId $item.id }}
                                                                <td>{{$item.name}}</td>
                                                            {{end}}
                                                        {{end}}
                                                    {{end}}
                                                {{end}}
                                            {{else}}
                                                {{range $key, $type := $.articleTypeList}}
                                                    {{if and (eq $type.child_status false) (eq $type.id $v.MenuId)}}
                                                        <td>{{$type.name}}</td>
                                                    {{end}}
                                                {{end}}
                                            {{end}}
                                            {{if $v.UpdateTime}}
                                                <td>{{$v.UpdateTime.Time.Format "2006-01-02 15:04:05"}}</td>
                                            {{else}}
                                                <td>{{$v.CreatedTime.Format "2006-01-02 15:04:05"}}</td>
                                            {{end}}
                                            <td>
                                                {{if eq $.top_id $v.Id}}
                                                    <span class="badge badge-danger-lighten badge-pill">置顶</span>
                                                {{else}}
                                                    <span class="badge badge-secondary-lighten badge-pill">普通</span>
                                                {{end}}
                                                {{if $v.Hot}}
                                                    <span class="badge badge-success-lighten badge-pill">热门</span>
                                                {{end}}
                                                {{if $v.Recommend}}
                                                    <span class="badge badge-primary-lighten badge-pill">推荐</span>
                                                {{end}}
                                            </td>
                                            <td>{{$v.View}}</td>
                                            <td>
                                                <a href="/api/article/move/down?sort={{$v.Sort}}&page={{$.articleList.current}}"
                                                   title="上移">
                                                    <i class="feather icon-arrow-up"></i>
                                                </a>
                                                <a href="/api/article/move/up?sort={{$v.Sort}}&page={{$.articleList.current}}"
                                                   title="下移">
                                                    <i class="feather icon-arrow-down"></i>
                                                </a>
                                            </td>
                                            <td>
                                                {{if $v.Visible}}
                                                    <a href="/api/article/issue?id={{$v.Id}}&status={{$v.Visible}}&page={{$.articleList.current}}"
                                                       class="text-warning">下架</a>
                                                {{else}}
                                                    <a href="/api/article/issue?id={{$v.Id}}&status={{$v.Visible}}&page={{$.articleList.current}}"
                                                       class="text-success">上架</a>
                                                {{end}}
                                                {{if eq $v.Visible false}}
                                                    <div role="separator" class="ant-divider ant-divider-vertical"
                                                         data-v-a1ccd506=""></div>
                                                    {{if $v.Markdown}}
                                                        <a href="/article/details/markdown?id={{$v.Id}}&title={{$v.Title}}"
                                                           class="text-c-blue">详情</a>
                                                    {{else}}
                                                        <a href="/article/details?id={{$v.Id}}&title={{$v.Title}}"
                                                           class="text-c-blue">详情</a>
                                                    {{end}}
                                                    <div role="separator"
                                                         class="ant-divider ant-divider-vertical"></div>
                                                    {{if $v.State}}
                                                        <a href="#!" class="text-c-blue text-facebook"
                                                           data-toggle="modal"
                                                           data-target="#danger-header-modal-{{$v.Id}}">已删除</a>
                                                    {{else}}
                                                        <a href="#!" class="text-c-blue text-danger" data-toggle="modal"
                                                           data-target="#danger-header-modal-{{$v.Id}}">删除</a>
                                                    {{end}}
                                                {{end}}
                                                {{if eq  $v.State false}}
                                                    <div id="danger-header-modal-{{$v.Id}}" class="modal fade"
                                                         tabindex="-1"
                                                         role="dialog" aria-labelledby="danger-header-modalLabel"
                                                         aria-hidden="true">
                                                        <div class="modal-dialog">
                                                            <div class="modal-content">
                                                                <div class="modal-header modal-colored-header bg-danger">
                                                                    <h4 class="modal-title"
                                                                        id="danger-header-modalLabel">
                                                                        删除文章</h4>
                                                                    <button type="button" class="close"
                                                                            data-dismiss="modal"
                                                                            aria-hidden="true">×
                                                                    </button>
                                                                </div>
                                                                <div class="modal-body">
                                                                    <h4 class="mt-0 text-center">
                                                                        <i class="mdi text-warning mdi-alert-circle"></i>
                                                                        <span class="font-14">是否删除该文章?</span>
                                                                    </h4>
                                                                </div>
                                                                <div class="modal-footer">
                                                                    <button type="button" class="btn btn-secondary"
                                                                            data-dismiss="modal">取消
                                                                    </button>
                                                                    <button type="button" class="btn btn-danger"
                                                                            onclick="deleteArticle({{$v.Id}})">确认
                                                                    </button>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                {{end}}
                                            </td>
                                        </tr>
                                    {{end}}
                                    </tbody>
                                {{end}}
                            </table>
                        </div>
                        <div class="d-flex justify-content-end align-items-center">
                            <ul class="pagination float-right pagination-rounded justify-content-end">
                                <li class="page-item default">
                                    <a class="page-link" href="javascript:;">共 {{ .articleList.total }} 条</a>
                                </li>
                                <li class="page-item">
                                    <a class="page-link"
                                       href="{{ if eq $.articleList.current 1}}javascript:;{{ else }}?page={{.articleList.prepage}}{{ end }}"
                                       aria-label="Previous">
                                        <span aria-hidden="true">&laquo;</span>
                                        <span class="sr-only">Previous</span>
                                    </a>
                                </li>
                                {{if gt $.articleList.current 5}}
                                    <li class="page-item"><a class="page-link" href="?page=1">1</a></li>
                                {{end}}
                                {{ range $k,$v := .articleList.pages }}
                                    {{ if and ( gt $.articleList.current 5 ) (eq $k 0) }}
                                        <li class="page-item"><a class="page-link" href="javascript: void(0);">...</a>
                                        </li>
                                    {{ else }}
                                        <li class="page-item">
                                            {{ if eq $v $.articleList.current }}
                                                <a class="page-link"
                                                   style="color:#fff;border-color: #5d78ff;background-color: #5d78ff;width: 33px;height: 33px;text-align: center;"
                                                   href="javascript: void(0);">{{ $v }}</a>
                                            {{ else }}
                                                <a class="page-link" href="?page={{ $v }}">{{ $v }}</a>
                                            {{ end }}
                                        </li>
                                    {{ end }}
                                {{ end }}
                                <li class="page-item">
                                    <a class="page-link"
                                       href="{{ if  eq $.articleList.current .articleList.totalpages}}javascript:;{{ else }}?page={{.articleList.nextpage}}{{ end }}"
                                       aria-label="Next">
                                        <span aria-hidden="true">&raquo;</span>
                                        <span class="sr-only">Next</span>
                                    </a>
                                </li>
                                <li class="page-item default">
                                    <a class="page-link" href="javascript:;">共 {{ .articleList.totalpages }} 页</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- sample modal content -->
        <div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
             aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title" id="myModalLabel">隐藏文章</h4>
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    </div>
                    <div class="modal-body">
                        <h4 class="mt-0 text-center">
                            <i class="mdi text-warning mdi-alert-circle"></i>
                            <span class="font-14">是否隐藏/显示该菜单？</span>
                        </h4>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <button type="button" class="btn btn-primary">Save changes</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- end page title -->
</div>